import React, { Component } from 'react';
import { StyleSheet, Clipboard } from 'react-native';
import { Container, Content, View, Button, Text, Toast } from 'native-base';
import { ListItem } from 'react-native-elements';
import { connect } from 'react-redux';

import DeviceInfos from 'react-native-device-info';
import { Header } from '../../component';
import { Colors, Metrics } from '../../theme';

class DeviceInfo extends Component {
  constructor(props) {
    super(props);
    this.state = {
      deviceInfo: [],
      itemIndex: '1',
    }
  }

  UNSAFE_componentWillMount() {

  }

  componentDidMount() {
    this.changeItemIndexFunc(this.state.itemIndex)
  }

  // 改变方法
  changeItemIndexFunc(index){
    this.setState({itemIndex: index});
    if (index == '1') {
      this.getDeviceInfoFunc1();
    } else if(index == '2') {
      this.getDeviceInfoFunc2();
    } else if(index == '3') {
      this.getDeviceInfoFunc3();
    }
  }

  // 点击复制
  clipboardFunc(str){
    str = str + '';
    Clipboard.setString(str);
    Toast.show({
      text: '文本已复制!',
      type: "success"
    })
  }

  // 设备信息 同步方法
  getDeviceInfoFunc1() {
    let deviceInfoList = [];

    deviceInfoList.push({ name: '品牌', funcName: 'getBrand', vals: DeviceInfos.getBrand() })
    deviceInfoList.push({ name: '当前应用名称', funcName: 'getApplicationName', vals: DeviceInfos.getApplicationName() })
    deviceInfoList.push({ name: '应用编译版本号', funcName: 'getBuildNumber', vals: DeviceInfos.getBuildNumber() })
    deviceInfoList.push({ name: '获取应用程序包标识符', funcName: 'getBundleId', vals: DeviceInfos.getBundleId() })
    deviceInfoList.push({ name: '设备ID', funcName: 'getDeviceId', vals: DeviceInfos.getDeviceId() })
    deviceInfoList.push({ name: '获取设备类型', funcName: 'getDeviceType', vals: DeviceInfos.getDeviceType() })
    deviceInfoList.push({ name: '获取设备模式', funcName: 'getModel', vals: DeviceInfos.getModel() })
    deviceInfoList.push({ name: '获取应用程序可读版本', funcName: 'getReadableVersion', vals: DeviceInfos.getReadableVersion() })
    deviceInfoList.push({ name: '获取系统名称', funcName: 'getSystemName', vals: DeviceInfos.getSystemName() })
    deviceInfoList.push({ name: '获取系统版本', funcName: 'getSystemVersion', vals: DeviceInfos.getSystemVersion() })
    deviceInfoList.push({ name: 'getUniqueId', funcName: 'getUniqueId', vals: DeviceInfos.getUniqueId() })
    deviceInfoList.push({ name: '设备版本', funcName: 'getVersion', vals: DeviceInfos.getVersion() })
    deviceInfoList.push({ name: 'hasNotch', funcName: 'hasNotch', vals: DeviceInfos.hasNotch() + '' })
    deviceInfoList.push({ name: '是否是平板电脑', funcName: 'isTablet', vals: DeviceInfos.isTablet() + '' })

    this.setState({ deviceInfo: deviceInfoList });
  }


  // 设备信息 异步方法
  getDeviceInfoFunc2() {
    DeviceInfos.getMacAddress().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: '网络适配器MAC地址', funcName: 'getMacAddress', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getIpAddress().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: '设备当前网络地址IP', funcName: 'getIpAddress', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getUserAgent().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: '设备用户代理', funcName: 'getUserAgent', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getTotalDiskCapacity().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: '完整磁盘空间大小(字节)', funcName: 'getTotalDiskCapacity', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getCarrier().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: '运营商名称', funcName: 'getIpgetCarrierAddress', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getPhoneNumber().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: '获取电话号码', funcName: 'getPhoneNumber', vals: vals })
      this.setState({ deviceInfo })
    });

  }



  getDeviceInfoFunc3() {

    DeviceInfos.getAndroidId().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getAndroidId', funcName: 'getAndroidId', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getApiLevel().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getApiLevel', funcName: 'getApiLevel', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getBuildId().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getBuildId', funcName: 'getBuildId', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getBatteryLevel().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getBatteryLevel', funcName: 'getBatteryLevel', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getBootloader().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getBootloader', funcName: 'getBootloader', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.isCameraPresent().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'isCameraPresent', funcName: 'isCameraPresent', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getCodename().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getCodename', funcName: 'getCodename', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getDevice().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getDevice', funcName: 'getDevice', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getDisplay().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getDisplay', funcName: 'getDisplay', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getDeviceName().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getDeviceName', funcName: 'getDeviceName', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getDeviceToken().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getDeviceToken', funcName: 'getDeviceToken', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getFirstInstallTime().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getFirstInstallTime', funcName: 'getFirstInstallTime', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getFingerprint().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getFingerprint', funcName: 'getFingerprint', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getFontScale().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getFontScale', funcName: 'getFontScale', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getFreeDiskStorage().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getFreeDiskStorage', funcName: 'getFreeDiskStorage', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getHardware().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getHardware', funcName: 'getHardware', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getHost().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getHost', funcName: 'getHost', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getIncremental().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getIncremental', funcName: 'getIncremental', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getInstallerPackageName().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getInstallerPackageName', funcName: 'getInstallerPackageName', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getInstallReferrer().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getInstallReferrer', funcName: 'getInstallReferrer', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getInstanceId().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getInstanceId', funcName: 'getInstanceId', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getLastUpdateTime().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getLastUpdateTime', funcName: 'getLastUpdateTime', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getManufacturer().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getManufacturer', funcName: 'getManufacturer', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getMaxMemory().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getMaxMemory', funcName: 'getMaxMemory', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getPowerState().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getPowerState', funcName: 'getPowerState', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getProduct().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getProduct', funcName: 'getProduct', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getPreviewSdkInt().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getPreviewSdkInt', funcName: 'getPreviewSdkInt', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getSerialNumber().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getSerialNumber', funcName: 'getSerialNumber', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getSecurityPatch().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getSecurityPatch', funcName: 'getSecurityPatch', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getTags().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getTags', funcName: 'getTags', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getType().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getType', funcName: 'getType', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getTotalMemory().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getTotalMemory', funcName: 'getTotalMemory', vals: vals })
      this.setState({ deviceInfo })
    });

    DeviceInfos.getUsedMemory().then(vals => {
      let deviceInfo = this.state.deviceInfo;
      deviceInfo.push({ name: 'getUsedMemory', funcName: 'getUsedMemory', vals: vals })
      this.setState({ deviceInfo })
    });
  }

  render() {
    return (
      <Container>
        <Header title="设备信息" onLeftPress={() => this.props.navigation.goBack()} />
        <View style={Styles.btnCont}>
            <Button style={this.state.itemIndex == '1'? Styles.activeBtn : Styles.inactiveBtn} onPress={() => this.changeItemIndexFunc('1')}>
              <Text>基础信息</Text>
            </Button>
            <Button style={this.state.itemIndex == '2'? Styles.activeBtn : Styles.inactiveBtn} onPress={() => this.changeItemIndexFunc('2')}>
              <Text>更多信息</Text>
            </Button>
            <Button style={this.state.itemIndex == '3'? Styles.activeBtn : Styles.inactiveBtn} onPress={() => this.changeItemIndexFunc('3')}>
              <Text>高阶信息</Text>
            </Button>
          </View>
        <Content>
          {
            this.state.deviceInfo.map((l, i) => (
              <ListItem
                key={i}
                title={l.name}
                subtitle={l.vals}
                bottomDivider
                badge={{ value: '点击复制' }}
                onPress={()=>{
                  this.clipboardFunc(l.vals)
                }}
              />
            ))
          }

        </Content>
      </Container>
    );
  }

}

const mapStateToProps = state => ({

});

const mapDispatchToProps = dispatch => ({

});
export default connect(mapStateToProps, mapDispatchToProps)(DeviceInfo);

const Styles = StyleSheet.create({
  btnCont: {
		flexDirection: "row",
		justifyContent: "space-between",
    alignItems: "center",
    padding: 5,
    backgroundColor: Colors.huiF2
  },
  activeBtn: {backgroundColor: Colors.subject},
  inactiveBtn: {backgroundColor: Colors.subject},
});